<template>
    <a-button
        :type="isSelect?'dashed':'primary'"
        @click="handleClickBatch"
        style="padding: 0 10px; margin-left: 10px"
    >
        {{isSelect?'取消':'检查'}}多音字
    </a-button>
</template>
<script setup>
import { ref, watch, onUnmounted } from "vue";

import PinyinBacthFn from "./pinyinBacth-fn.js";
import { getEmitter } from "../../coreComponents/emitter.js";

import {
    polyphoneDataToLabelValue,
    getPolyphoneData,
} from "../../utils/pinyin.js";
import { message } from "ant-design-vue";

const fn = ref();

const isSelect = ref(false);
const editorRef = ref();

const onOpen = (editor) => {
    if (!fn.value && editor) {
        // console.log('onOpen')
        editorRef.value = editor;
        fn.value = new PinyinBacthFn(editor);
    }
};

function unWrapTraverseTree(node, index, path, callback) {
    // 将当前节点的值添加到路径中
    const currentPath = [...path, index];

    // 调用回调函数处理当前节点，包括它的路径
    callback(node, currentPath);
    // 如果存在子节点，递归遍历每个子节点
    if (node.type && node.children && node.children.length > 0) {
        for (let i = 0; i < node.children.length; i++) {
            traverseTree(node.children[i], i, currentPath, callback);
        }
    }
}

function traverseTree(node, index, path, callback) {
    // 将当前节点的值添加到路径中
    const currentPath = [...path, index];

    // 调用回调函数处理当前节点，包括它的路径
    callback(node, currentPath);
    // 如果存在子节点，递归遍历每个子节点
    if (
        node.type &&
        node.type != "ssml-phoneme" &&
        node.type != "ssml-mark" &&
        node.children &&
        node.children.length > 0
    ) {
        for (let i = 0; i < node.children.length; i++) {
            traverseTree(node.children[i], i, currentPath, callback);
        }
    }
}
const unSelectAllPhone = () => {
    var count = 0;
    while (count < 10000) {
        count++;
        var list = [];
        for (let i = 0; i < editorRef.value.children.length; i++) {
            var item = editorRef.value.children[i];
            traverseTree(item, i, [], (node, path) => {
                if (node && node.type == "ssml-mark") {
                    list.push(path);
                }
            });
        }
        if (list.length == 0) {
            return;
        }
        console.log("selectionList", editorRef.value.children, list);

        var path = list[0];
        fn.value?.execUnwrapNodes(path);
    }
};

const selectAllPhone = () => {
    var count = 0;
    while (count < 10000) {
        count++;
        var optionList = [];
        for (let i = 0; i < editorRef.value.children.length; i++) {
            var item = editorRef.value.children[i];
            traverseTree(item, i, [], (node, path) => {
                if (node && !node.type && node.text) {
                    var text = node.text;
                    for (var i = 0; i < text.length; i++) {
                        var item = text[i];
                        if (/^[\u4E00-\u9FA5]$/gi.test(item)) {
                            var result = getPinyinList(item);
                            if (result.length > 1) {
                                const obj = {
                                    pyList: result,
                                    selection: {
                                        anchor: {
                                            path: path,
                                            offset: i,
                                        },
                                        focus: {
                                            path: path,
                                            offset: i + 1,
                                        },
                                    },
                                };

                                optionList.push(obj);
                                break;
                            }
                        }
                    }
                }
            });
        }
        if (optionList.length == 0) {
            return;
        }
        console.log("selectionList", optionList);
        // for (var i in optionList) {
        var opt = optionList[0];
        // SlateTransforms.select(editorRef.value, selection);
        fn.value?.exec(opt);
        // }
    }
};
function handleClickBatch() {
    if (fn.value.isDisabled()) {
        return;
    }
    isSelect.value = !isSelect.value;
    if (isSelect.value) {
        selectAllPhone();
    } else {
        unSelectAllPhone();
    }
}

function getPinyinList(word) {
    const polyphoneData = getPolyphoneData(word);
    return polyphoneDataToLabelValue(polyphoneData);
}

const props = defineProps({
    editor: {
        type: Object,
        default: null,
    },
});

watch(
    () => props.editor,
    (val) => {
        // console.log("props.editor", props.editor);
        onOpen(props.editor);
    },
    { immediate: true, deep: true }
);

// 调用这个函数将子组件的一些数据和方法暴露出去
defineExpose({
    onOpen,
});
</script>

<style>
.popover-main {
    position: absolute;
    z-index: 1000;
}

.popover-content {
    background-color: #fff;
    border: 1px solid #ccc;
    padding: 10px;
    border-radius: 5px;
    user-select: none;
    margin-top: 40px;
    position: relative;
    /* margin-top: 10px; */
}
.popover-content::before {
    content: "";
    position: absolute;
    bottom: 100%;
    left: 20%;
    border-width: 5px; /* 可以根据需要调整大小 */
    border-style: solid;
    border-color: transparent;
    border-bottom-color: #ccc; /* 边框颜色 */
    transform: translateX(-50%);
}
</style>
